<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>

<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="../css/zcss/switchery.min.css" rel="stylesheet">
<link href="../css/zcss/bootstrap-clockpicker.min.css" rel="stylesheet">
<link href="../css/zcss/bootstrap-table.min.css" rel="stylesheet"
	type="text/css">
<link href="../css/zcss/bootstrap.min.css" rel="stylesheet"
	type="text/css">
<link href="../css/zcss/bootstrap-select.min.css" rel="stylesheet"
	type="text/css">
<link href="../css/zcss/core.css" rel="stylesheet" type="text/css">
<link href="../css/zcss/components.css" rel="stylesheet" type="text/css">
<link href="../css/zcss/icons.css" rel="stylesheet" type="text/css">
<link href="../css/zcss/pages.css" rel="stylesheet" type="text/css">
<link href="../css/zcss/responsive.css" rel="stylesheet" type="text/css">
<link href="../css/zcss/sweetalert.min.css" rel="stylesheet"
	type="text/css">
<link href="../css/zcss/custombox.min.css" rel="stylesheet">
<link href="../css/zcss/animate.min.css" rel="stylesheet"
	type="text/css">
<link href="../css/zcss/css.css" rel="stylesheet" type="text/css">

<link href="../css/zcss/bootstrap-datepicker3.min.css" rel="stylesheet">
<link href="../css/zcss/switchery.min.css" rel="stylesheet">
<link href="../css/zcss/bootstrap-clockpicker.min.css" rel="stylesheet">
<link href="../css/zcss/bootstrap-table.min.css" rel="stylesheet"
	type="text/css">
<link href="../css/zcss/bootstrap.min.css" rel="stylesheet"
	type="text/css">
<link href="../css/zcss/bootstrap-select.min.css" rel="stylesheet"
	type="text/css">
<link href="../css/zcss/core.css" rel="stylesheet" type="text/css">
<link href="../css/zcss/components.css" rel="stylesheet" type="text/css">

<!--图标的外部样式-->
<link href="http://cdn.xtcrm.com/cdn//v7/fm/ub/css/icons.css"
	rel="stylesheet" type="text/css">
<!--图标的外部样式-->



<link href="../css/zcss/pages.css" rel="stylesheet" type="text/css">
<link href="../css/zcss/responsive.css" rel="stylesheet" type="text/css">
<link href="../css/zcss/sweetalert.min.css" rel="stylesheet"
	type="text/css">
<link href="../css/zcss/custombox.min.css" rel="stylesheet">
<link href="../css/zcss/animate.min.css" rel="stylesheet"
	type="text/css">
<link href="../css/zcss/css.css" rel="stylesheet" type="text/css">



<script src="http://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<!-- 引入样式 -->
<link rel="stylesheet"
	href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
<!-- 引入组件库 -->
<script src="https://unpkg.com/element-ui/lib/index.js"></script>
<script type="text/javascript" src="../js/axios.js"></script>
<script type="text/javascript" src="../js/qs.js"></script>

<!--[if lt IE 9]>
    <script src="http://cdn.xtcrm.com/cdn//v7/fm/ub/js/html5shiv.js"></script>
    <script src="http://cdn.xtcrm.com/cdn//v7/fm/ub/js/respond.min.js"></script>
    <![endif]-->
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

</head>

<body class="bg-lightbule" onload=";" style="height: 1000px"
	onfocus="wclose();">

	<div class="createOrderbox">


		<title>销售机会视图：${ingOid}</title>
		<style>
.text-gray {
	color: #DDDDDD !important;
}
</style>

		<div id="wrapper" class="enlarged forced">
			<div class="content m-20">
				<div class="container-fluid">

					<div id="downing"
						style="position: fixed; display: none; z-index: 10000; left: 960px; top: 300px;">
						<i class="fa-li fa fa-spinner fa-spin fa-4x"></i>
					</div>


					<div id="del"
						style="position: absolute; visibility: hidden; left: 0; top: 0; width: 0; height: 0; z-index: 100; background-color: #D4D0C8;"></div>
					<!-- basewin iframe -->

					<div id="popshow_container" class="modal fade" tabindex="-1"
						role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"
						style="display: none;">
						<div class="modal-dialog modal-xg">
							<div class="modal-content" id="popshow_container_content"
								style="padding: 0px 0px; border-width: 0px; height: 0px;">
								<div class="modal-body " id="popshow" style="display: none;">
									<div id="popshowcont">
										<div id="gedit"></div>
									</div>
								</div>
							</div>
						</div>
					</div>

					<div id="popact" class="modal fade" tabindex="-1" role="dialog"
						aria-labelledby="myModalLabel" aria-hidden="true"
						style="display: none;">
						<div class="modal-dialog">
							<div class="modal-content">
								<div class="modal-header">
									<button type="button" class="close" data-dismiss="modal"
										aria-hidden="true">×</button>
									<h4 class="modal-title" id="">操作</h4>
								</div>
								<div class="modal-body"></div>
								<div class="modal-footer">
								</div>
							</div>
						</div>
					</div>
					<div class=" text-center text-gray f-s-12 m-b-30">
						<div class="icon-box">
						</div>
						<div class="icon-box">
						</div>
					</div>
					<!-- END approve -->
					<div id="qshow" style="z-index: 0">
                            <div id = "app" class="app">
						<div class="portlet form-horizontal border-n">
							<div class="portlet-heading portlet-default">
								<div class="pull-right  f-s-12">
								<span style="color:black; " v-model="demand" prop="demand">客户需求： {{demand}}</span>
								<span style="color:black;">解决方案: {{solution}}</span>
								<span style="color:black;">竞争对手: {{comp}}</span>
								<span style="color:black;">商务报价: {{price}}</span>
									<button class="btn btn-white waves-effect waves-light"
										onclick="qshow_click_edit(174,&quot;e2c323&quot;);return false;">
										<i class="fa fa-pencil m-r-5"></i>编辑
									</button>
									&nbsp;
									<button class="btn btn-white waves-effect waves-light"
										onclick="qshow_click_del(174,&quot;contract&quot;,&quot;e2c323&quot;);return false;">
										<i class="fa fa-trash-o m-r-5"></i>删除
									</button>
									&nbsp;
									<!--<span class="button_close_qshow"><button class=" btn btn-default waves-effect waves-light m-r-5" data-dismiss="modal" aria-hidden="true"><i class="fa fa-close m-r-5"></i>关闭</button></span>-->

								</div>
								<h4 class="modal-title text-dark">
									<span set-lan="html:销售机会">销售机会</span> <a target="_blank"
										href="/system/viewlog.xt?dtname=contract&amp;id=174&amp;mdb=ac14c8dfa7c3ddfb3ff7fb537f7d0200"
										data-toggle="tooltip" data-placement="bottom" title=""
										data-original-title="数据日志"><i class="fa fa-bars m-r-5"></i></a>
								</h4>
								
								<hr class="border-t-a">
                                 
							</div>
							<div class="gedit_scroll_content">
								
								<div id="bg-default" class="panel-collapse collapse in">
									<div class="portlet-body p-t-0 p-r-7 show-box" v-for="opp in opport">
										<div class="row">
										<h5 align="center">销售机会</h5>
										<hr color="black" align="center" style="width: 40%; " >
											<div class="col-md-6">
											
												<div class="form-group ">
													<label class="control-label col-md-4">机会名称:</label>
													<div class="form-control  col-md-8">&nbsp;&nbsp;{{opp.opp_name}}</div>
												</div>
											</div>
											<div class="col-md-6">
												<div class="form-group ">
													<label class="control-label col-md-4">更新日期:</label>
													<div class="form-control  col-md-8">{{opp.opp_date}}</div>
												</div>
											</div>
										</div>
										
											
												<div class="col-md-6">
												<div class="form-group ">
													<label class="control-label col-md-4">对应客户:</label>
													<div class="form-control  col-md-8">&nbsp;&nbsp;{{opp.cus_name}}</div>
												</div>
											</div>
											<div class="col-md-6">
												<div class="form-group ">
													<label class="control-label col-md-4">阶段:</label>
													<div class="form-control  col-md-8">&nbsp;&nbsp;{{opp.stage}}</div>
												</div>
											</div>
										
										<div class="row">
										
										
										<h6 align="center">最新进度</h6>
										<hr align="center" color="black" style="width: 40%; " >
											<div class="col-md-6">
												<div class="form-group ">
													<label class="control-label col-md-4">需求:</label>
													<div class="form-control  col-md-8">{{opp.dem_name}}</div>
												</div>
											</div>
											<div class="col-md-6">
												<div class="form-group ">
													<label class="control-label col-md-4">内容:</label>
													<div class="form-control  col-md-8">{{opp.dem_content}}</div>
												</div>
											</div>
										</div>

										
										<div class="row">
											<div class="col-md-6">
												<div class="form-group ">
													<label class="control-label col-md-4">需求时间:</label>
													<div class="form-control  col-md-8">{{opp.dem_writetime}}</div>
												</div>
											</div>
											<div class="col-md-6">
												<div class="form-group ">
													<label class="control-label col-md-4">重要程度:</label>
													<div class="form-control  col-md-8">{{opp.mportance}}</div>
												</div>
											</div>
										</div>
										<div class="row">
											<div class="col-md-6">
												<div class="form-group ">
													<label class="control-label col-md-4">解决方案:</label>
													<div class="form-control  col-md-8">{{opp.sol_name}}</div>
												</div>
											</div>
                                             <div class="col-md-6">
												<div class="form-group ">
													<label class="control-label col-md-4">解决时间:</label>
													<div class="form-control  col-md-8">{{opp.sol_submission}}</div>
												</div>
											</div>
										</div>
										<div class="row">
											
											<div class="col-md-6">
												<div class="form-group ">
													<label class="control-label col-md-4">方案内容:</label>
													<div class="form-control  col-md-8">{{opp.sol_content}}</div>
												</div>
											</div>
											
											<div class="col-md-6" style="display:">
												<div class="form-group ">
													<label class="control-label col-md-4">客户反馈:</label>
													<div class="form-control  col-md-8">{{opp.sol_feedback}}</div>
												</div>
											</div>
											
										</div>
										<div class="row">
											<div class="col-md-6">
												<div class="form-group ">
													<label class="control-label col-md-4">竞争对手:</label>
													<div class="form-control  col-md-8">{{opp.com_name}}</div>
												</div>
											</div>
											<div class="col-md-6">
												<div class="form-group ">
													<label class="control-label col-md-4">竞争价格:</label>
													<div class="form-control  col-md-8">{{opp.com_price}}.00</div>
												</div>
											</div>
										</div>
										<div class="row">
											<div class="col-md-6">
												<div class="form-group ">
													<label class="control-label col-md-4">优势:</label>
													<div class="form-control  col-md-8">{{opp.com_advantage}}</div>
												</div>
											</div>
											<div class="col-md-6">
												<div class="form-group ">
													<label class="control-label col-md-4">劣势:</label>
													<div class="form-control  col-md-8">{{opp.com_disadvantage}}</div>
												</div>
											</div>
										</div>
										
										<div class="row">
											<div class="col-md-6">
												<div class="form-group ">
													<label class="control-label col-md-4">报价主题:</label>
													<div class="form-control  col-md-8">{{opp.off_name}}</div>
												</div>
											</div>
											<div class="col-md-6">
												<div class="form-group ">
													<label class="control-label col-md-4">报价金额:</label>
													<div class="form-control  col-md-8">{{opp.off_offer}}</div>
												</div>
											</div>
										</div>
										<div class="row">
											<div class="col-md-6">
												<div class="form-group ">
													<label class="control-label col-md-4">报价时间:</label>
													<div class="form-control  col-md-8">{{opp.off_quotationtime}}</div>
												</div>
											</div>
											
										</div>
										
										
										<div class="p-t-20 text-center">
											<div class=""></div>
											<hr>
										</div>

									</div>
								</div>
							
							
							
							
							</div>
							<div class="text-right p-20">
								
								&nbsp;
								<button class="btn btn-white waves-effect waves-light"
									onclick="qshow_click_edit(174,&quot;e2c323&quot;);return false;">
									<i class="fa fa-pencil m-r-5"></i>编辑
								</button>
								&nbsp;
								<button class="btn btn-white waves-effect waves-light"
									onclick="qshow_click_del(174,&quot;contract&quot;,&quot;e2c323&quot;);return false;">
									<i class="fa fa-trash-o m-r-5"></i>删除
								</button>
								&nbsp;
								<!--<span class="button_close_qshow"><button class=" btn btn-default waves-effect waves-light m-r-5" data-dismiss="modal" aria-hidden="true"><i class="fa fa-close m-r-5"></i>关闭</button></span>-->

							</div>
						</div>
</div>
						<!--UTF8-->
					</div>
					
				</div>
			</div>
		</div>
	</div>


	<script type="text/javascript">
	var vm = new Vue({
		el: "#app",
		data() {
			return {
				demand:0,
				solution:'',
				comp:'',
				price:'',
				opport:[],
				opportcount:'',
				form: {
					
				},
				rules: { 
				}
			}
		},
		methods: {
			submitForm(formName) {
				//验证方法
				this.$refs[formName].validate((valid) => {
					if(valid) {
						var ax = null;
						if (JSON.stringify(${linkmanaaa}) == '{}') {
							ax = "/addlinkman";
						    console.log(1);
						}else{
							ax = "/updatelin";
							 console.log(2);
							 alert("进来了");
						}
						//post提交数据
					     alert(ax);
						axios.post(ax,
							//参数转换
							Qs.stringify(this.form, {
								arrayFormat: 'brackets'
							})
						).then(function(v) {
							window.parent.location.replace("/linkman");
						}).catch(function(e) {
							alert("出错了"+e);
						});

					} else {
						console.log('error submit!!');
						return false;
					}
				});
			},
			resetForm(formName) {
				this.$refs[formName].resetFields();
			},
		
			

			//queryString实时的文本框的值,cb回调函数
			querySearch: function(queryString, cb) {
				 var allarr = this.form.restaurants;
		    	 // console.info(allarr);
		    	 
					var newsarr = [];
					allarr.forEach(v => {
						 var strs =v.cus_name+"";
						 if (strs.indexOf(queryString) >= 0) {
								newsarr.push(v);
								console.info(strs);
								console.info(v);
							} 
					})
					// 调用 callback 返回建议列表的数据
					cb(newsarr);
			},
			handleSelect: function(it) {
				this.form.cust=it.cus_name;
				this.form.custid=it.cus_id;
			}
		},
		mounted() {
             var ss = ${oppView};
			 this.opport=ss;
			 var a = ${oppCount};
			 this.demand = a.demand;
			 this.solution = a.solution;
			 this.comp =  a.competitors;
			 this.price = a.offers;
			console.log(a);
		}
	});
		</script>
</body>
</html>